<div>
  <div class="main-title">
    <h2>分类管理</h2>
  </div>
  <div class="main-section">
    <a href="{:url('edit')}" class="btn btn-success">+ 新增</a>
  </div>
  <div class="main-section">
    <form method="post" action="{:url('sort')}" class="j-form">
      <table class="table table-striped table-bordered table-hover">
        <thead>
          <tr>
            <th width="55">序号</th>
            <th width="60">图片</th>
            <th>名称</th>
            <th width="100">操作</th>
          </tr>
        </thead>
        <tbody>
          {foreach $category as $v}
          <tr class="j-pid-{$v.pid}" {if $v.level}style="display:none" {/if}> <td><input type="text"
              class="form-control j-sort" maxlength="5" value="{$v.sort}" data-name="sort[{$v.id}]"
              style="height:25px;font-size:12px;padding:0 5px;"></td>
            <td><a href="{:url('edit', ['id' => $v.id])}"><img src="{if 
              $v.image}__UPLOAD__/{$v.image}{else /}__STATIC__/goods/img/noimg.png{/if}" width="50" height="50"></a>
            </td>
            <td>
              {if $v.level}
              <small class="text-muted">├──</small> {$v.name}
              {else /}
              {if $v.isLeaf}
              {$v.name}
              {else /}
              <a href="#" class="j-toggle" data-id="{$v.id}"><i class="fa fa-plus-square-o
                   fa-minus-square-o fa-fw"></i>{$v.name}</a>
              {/if}
              {/if}
            </td>
            <td>
              <a href="{:url('edit', ['id' => $v.id])}" style="margin-right:5px;">编辑</a>
              <a href="{:url('delete', ['id' => $v.id])}" class="j-del text-danger">删除</a>
            </td>
          </tr>
          {/foreach}
          {if empty($category)}
          <tr>
            <td colspan="4" class="text-center">还没有添加项目</td>
          </tr>
          {/if}
        </tbody>
      </table>
      <input type="submit" value="改变排序" class="btn btn-primary">
    </form>
  </div>
</div>
<script>
  main.ajaxForm('.j-form', function () {
    main.contentRefresh();
  });
  $('.j-sort').change(function () {
    $(this).attr('name', $(this).attr('data-name'));
  });
  $('.j-del').click(function () {
    if (confirm('您确定要删除此项？')) {
      main.ajaxPost($(this).attr('href'), function () {
        main.contentRefresh();
      });
    }
    return false;
  });
  $('.j-toggle').click(function () {
    var id = $(this).attr('data-id');
    $(this).find('i').toggleClass('fa-plus-square-o');
    $('.j-pid-' + id).toggle();
    return false;
  });
</script>